<template>
	<view>
		<view class="questionBankAnswer-jiexi">
			<!--如果答对加class=dui-->
			<view class="questionBankAnswer-jiexi-daan"
				:class="[answer_type(timu_order-1) == 1  ? 'dui' : 'cuo',current_timu.type == 5 ? 'jianda' : '']">
				<view class="questionBankAnswer-jiexi-daan-flex">
					<view class="dui_jd_b">{{current_timu.type == 5 ? '参考答案' : '正确答案'}}</view>
					<view class="questionBankAnswer-jiexi-daan-flex-dui"
						v-if="current_timu.right_answer == 1 || current_timu.right_answer == 0">
						{{ current_timu.right_answer == 1 ? '对' : '错' }}
					</view>
					<view v-else-if="current_timu.type != 4" class="questionBankAnswer-jiexi-daan-flex-dui"
						:style="{'font-size':(current_timu.type > 3 ?'16px':'30px')}">
						<uc-parse :node="current_timu.right_answer"></uc-parse>
					</view>
					<view v-else-if="current_timu.type == 4" class="questionBankAnswer-jiexi-daan-flex-dui"
						:style="{'font-size':(current_timu.type > 3 ?'16px':'30px')}"
						v-html="current_timu.right_answer.split('|').join(',')">
					</view>
				</view>
				<view class="questionBankAnswer-jiexi-flex" v-if="myAnswer">
					<view v-if="current_timu.type != 5" class="questionBankAnswer-jiexi-daan-line"></view>
					<view class="questionBankAnswer-jiexi-daan-flex">
						<view>我的答案</view>
						<view style="word-break: break-all;"
							:class="[(copy_post_answer_right[current_timu.id] || answer_type(timu_order-1) == 1)?'questionBankAnswer-jiexi-daan-flex-dui':'questionBankAnswer-jiexi-daan-flex-cuo']"
							:style="{'font-size':(current_timu.type > 3 ?'16px':'30px')}">{{myAnswer}}
						</view>
					</view>
				</view>
			</view>
			<view class="questionBankAnswer-jiexi-jx"
				v-if="(level == 2 || level == 3) && (current_timu.area != '' && current_timu.area != null)">
				<view class="questionBankAnswer-jiexi-jx-title">试题解析</view>
				<view>
					<uc-parse :node="current_timu.area"></uc-parse>
				</view>
			</view>
			<view class="questionBankAnswer-jiexi-jx" v-if="level == 3">
				<view class="questionBankAnswer-jiexi-jx-title">视频解析</view>
				<view>
					<view class="flex-center" v-if="current_timu.video_fullurl != '' && current_timu.video_fullurl != null">
						<video id="myVideo" :src="current_timu.video_fullurl" @error="videoErrorCallback" controls></video>
					</view>
					<view v-else-if="level == 3" class="t1">
						暂无视频解析
					</view>
				</view>
			</view>
		</view>

		<view v-if="(level == 2 || level == 3) && (current_timu.area != '' && current_timu.area != null)" class="bottomt1">
			--以上内容均来自于网络--
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			timu_order: {
				type: Number,
				default: 0
			},
			level: {
				type: Number,
				default: 0
			},
			show_beiti: {
				type: Boolean,
				default: true,
			},
			current_timu: {
				type: Object,
				default: function () {
					return {}
				},
			},
			timu_list: {
				type: Array,
				default: function () {
					return [];
				},
			},
			copy_post_answer_right: {
				type: Object,
				default: function () {
					return {}
				},
			},
		},
		data() {
			return {
				myAnswer: ''
			}
		},

		methods: {
			videoErrorCallback: function (e) {
				uni.showModal({
					content: "视频资源加载错误" + e.target.errMsg,
					showCancel: false
				})
			},
			//我的答案处的背景颜色
			answer_type(index) {
				if (this.show_beiti || this.timu_list[index].state == 2) {
					return 1
				}
				return 0
			},
			my_answer(copy_user_answer) {
				let answers = copy_user_answer[this.current_timu.id] || [];
				if (this.current_timu.type <= 3) {
					let answer = '';
					if (answers && answers.length > 0) {
						for (let i = 0, leng = answers.length; i < leng; i++) {
							if (answers[i].active) {
								answer += answers[i].answer_code
							}
						}
					}
					if (answer === '1') {
						answer = '对'
					} else if (answer === '0') {
						answer = '错'
					}
					this.myAnswer = answer
				} else {
					if (answers && answers.length == 0) {
						this.myAnswer = ''
						// || (this.current_timu.my_answer_arr || []).join(',')
					} else {
						this.myAnswer = answers.join(',')
					}
				}
			},
		}
	}
</script>

<style scoped>
	.bottomt1 {
		width: 200rpx;
		margin: 0rpx auto;
		margin-bottom: 9rpx;
		font-size: 13rpx;
		color: #afafaf;
		text-align: center;
	}

	.t1 {
		font-size: 20rpx;
		color: #afafaf;
	}

	.flex-center {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>